<!--
 * @Author: Christion.Young
 * @Date: 2020-11-24 17:51:01
 * @LastEditors: zhangjingyu
 * @LastEditTime: 2021-01-04 17:43:58
 * @Description: 弹出框
-->
<template>
  <div>
    <el-dialog
      v-dialogDrag
      append-to-body
      :title="titleName"
      :visible.sync="dialogVisible"
      :before-close="handleClose"
      width="1000px"
      top="5%"
    >
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane name="basicInformation" label="基本信息">
          <el-form
            :model="saveForm"
            ref="saveForm"
            label-width="80px"
            label-position="left"
            :rules="saveFormRules"
          >
            <el-row>
              <el-col :span="24">
                <el-form-item label="编码:" prop="driverCode">
                  <el-input v-model="saveForm.driverCode" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="名称:" prop="driverName">
                  <el-input
                    v-model="saveForm.driverName"
                    maxlength="20"
                    show-word-limit
                    :disabled="popupWindowType == '3'"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="类型:" prop="driverType">
                  <el-radio-group
                    v-model="saveForm.driverType"
                    @change="radioChange"
                    :disabled="popupWindowType == '3' || referenceId"
                  >
                    <!-- <el-radio label="0" v-if="false">静态动因</el-radio> -->
                    <el-radio label="0">静态动因</el-radio>
                    <el-radio label="1">动态动因</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="权限:" prop="driverAuthority">
                  <el-radio-group
                    v-model="saveForm.driverAuthority"
                    :disabled="popupWindowType == '3'"
                  >
                    <el-radio label="0">任何人可读写</el-radio>
                    <el-radio label="1">创建人可读写其他人可读</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="描述:" prop="driverDesc">
                  <el-input
                    type="textarea"
                    placeholder="请输入内容"
                    v-model="saveForm.driverDesc"
                    :disabled="popupWindowType == '3'"
                    maxlength="100"
                    show-word-limit
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-tab-pane>
        <el-tab-pane name="agentInformation" label="动因信息">
          <!-- 静态动因 -->
          <div v-if="saveForm.driverType !== '0' ? false : true">
            <el-form
              :model="saveFormStatic"
              ref="saveFormStatic"
              label-position="left"
              :rules="saveFormStaticRules"
            >
              <el-row>
                <el-col :span="12">
                  <el-form-item label="源层级:" label-width="100px" prop="driverDimY">
                    <el-select
                      v-model="saveFormStatic.driverDimY"
                      style="width: 200px"
                      placeholder="请选择"
                      :disabled="popupWindowType == '3'"
                      @change="driverDimYOptions"
                    >
                      <el-option
                        v-for="item in tierOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="源:" label-width="50px">
                    <el-row style="margin-right: 10px">
                      <el-col :span="8" style="padding-right: 8px">
                        <div class="elSelectiveBox">
                          <el-select
                            v-model="saveFormStatic.driverDimY1"
                            style="width: 100px"
                            placeholder="请选择"
                            :disabled="popupWindowType == '3'"
                            @change="onChangeProgramY1()"
                          >
                            <el-option
                              v-for="item in dropDownOptions"
                              v-show="
                                item.dictCode == saveFormStatic.driverDimY1 ||
                                !selectIdsArr.includes(item.dictCode)
                              "
                              :key="item.dictCode"
                              :label="item.dictName"
                              :value="item.dictCode"
                            ></el-option>
                          </el-select>
                          <el-tag
                            style="cursor: pointer"
                            @click="
                              driverDimY1Change(saveFormStatic.driverDimY1)
                            "
                          >选择</el-tag>
                        </div>
                        <div class="selectiveBox">
                          <el-tag
                            :key="tag + Math.random() + ''"
                            v-for="tag in driverDimY1List"
                            class="selectiveBoxEl"
                            closable
                            :disable-transitions="true"
                            effect="dark"
                            @close="driverDimY1Clos(tag)"
                          >
                            <div class="selectiveBoxTag">{{ tag.name }}</div>
                          </el-tag>
                        </div>
                      </el-col>
                      <el-col
                        v-if="
                          saveFormStatic.driverDimY == '2' ||
                          saveFormStatic.driverDimY == '3'
                        "
                        :span="8"
                        style="padding-right: 8px"
                      >
                        <div class="elSelectiveBox">
                          <el-select
                            v-model="saveFormStatic.driverDimY2"
                            style="width: 100px"
                            placeholder="请选择"
                            :disabled="popupWindowType == '3'"
                            @change="onChangeProgramY2()"
                          >
                            <el-option
                              v-for="item in dropDownOptions"
                              :key="item.dictCode"
                              :label="item.dictName"
                              :value="item.dictCode"
                              v-show="
                                item.dictCode == saveFormStatic.driverDimY2 ||
                                !selectIdsArr.includes(item.dictCode)
                              "
                            ></el-option>
                          </el-select>
                          <el-tag
                            style="cursor: pointer"
                            @click="
                              driverDimY2Change(saveFormStatic.driverDimY2)
                            "
                          >选择</el-tag>
                        </div>
                        <div class="selectiveBox">
                          <el-tag
                            :key="tag + Math.random() + ''"
                            v-for="tag in driverDimY2List"
                            class="selectiveBoxEl"
                            closable
                            :disable-transitions="true"
                            effect="dark"
                            @close="driverDimY2Clos(tag)"
                          >
                            <div class="selectiveBoxTag">{{ tag.name }}</div>
                          </el-tag>
                        </div>
                      </el-col>
                      <el-col
                        v-if="saveFormStatic.driverDimY == '3'"
                        :span="8"
                        style="padding-right: 8px"
                      >
                        <div class="elSelectiveBox">
                          <el-select
                            v-model="saveFormStatic.driverDimY3"
                            style="width: 100px"
                            placeholder="请选择"
                            @change="onChangeProgramY3()"
                            :disabled="popupWindowType == '3'"
                          >
                            <el-option
                              v-for="item in dropDownOptions"
                              :key="item.dictCode"
                              :label="item.dictName"
                              :value="item.dictCode"
                              v-show="
                                item.dictCode == saveFormStatic.driverDimY3 ||
                                !selectIdsArr.includes(item.dictCode)
                              "
                            ></el-option>
                          </el-select>
                          <el-tag
                            style="cursor: pointer"
                            @click="
                              driverDimY3Change(saveFormStatic.driverDimY3)
                            "
                          >选择</el-tag>
                        </div>
                        <div class="selectiveBox">
                          <el-tag
                            :key="tag + Math.random() + ''"
                            v-for="tag in driverDimY3List"
                            class="selectiveBoxEl"
                            closable
                            :disable-transitions="true"
                            effect="dark"
                            @close="driverDimY3Clos(tag)"
                          >
                            <div class="selectiveBoxTag">{{ tag.name }}</div>
                          </el-tag>
                        </div>
                      </el-col>
                    </el-row>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="目标层级:" label-width="100px" prop="driverDimX">
                    <el-select
                      v-model="saveFormStatic.driverDimX"
                      style="width: 200px"
                      placeholder="请选择"
                      :disabled="popupWindowType == '3'"
                    >
                      <el-option
                        v-for="item in tierOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="目标:" label-width="50px">
                    <el-row style="margin-right: 10px">
                      <el-col :span="8" style="padding-right: 8px">
                        <div class="elSelectiveBox">
                          <el-select
                            :disabled="popupWindowType == '3'"
                            v-model="saveFormStatic.driverDimX1"
                            style="width: 100px"
                            placeholder="请选择"
                            @change="onChangeProgramX1()"
                          >
                            <el-option
                              v-for="item in dropDownOptions"
                              :key="item.dictCode"
                              :label="item.dictName"
                              :value="item.dictCode"
                              v-show="
                                item.dictCode == saveFormStatic.driverDimX1 ||
                                !selectIdsArrX.includes(item.dictCode)
                              "
                            ></el-option>
                          </el-select>
                          <el-tag
                            style="cursor: pointer"
                            @click="
                              driverDimX1Change(saveFormStatic.driverDimX1)
                            "
                          >选择</el-tag>
                        </div>
                        <div class="selectiveBox">
                          <el-tag
                            :key="tag + Math.random() + ''"
                            v-for="tag in driverDimX1List"
                            class="selectiveBoxEl"
                            closable
                            :disable-transitions="true"
                            effect="dark"
                            @close="driverDimX1Clos(tag)"
                          >
                            <div class="selectiveBoxTag">{{ tag.name }}</div>
                          </el-tag>
                        </div>
                      </el-col>
                      <el-col
                        v-if="
                          saveFormStatic.driverDimX == '2' ||
                          saveFormStatic.driverDimX == '3'
                        "
                        :span="8"
                        style="padding-right: 8px"
                      >
                        <div class="elSelectiveBox">
                          <el-select
                            v-model="saveFormStatic.driverDimX2"
                            style="width: 100px"
                            placeholder="请选择"
                            @change="onChangeProgramX2()"
                            :disabled="popupWindowType == '3'"
                          >
                            <el-option
                              v-for="item in dropDownOptions"
                              :key="item.dictCode"
                              :label="item.dictName"
                              :value="item.dictCode"
                              v-show="
                                item.dictCode == saveFormStatic.driverDimX2 ||
                                !selectIdsArrX.includes(item.dictCode)
                              "
                            ></el-option>
                          </el-select>
                          <el-tag
                            style="cursor: pointer"
                            @click="
                              driverDimX2Change(saveFormStatic.driverDimX2)
                            "
                          >选择</el-tag>
                        </div>
                        <div class="selectiveBox">
                          <el-tag
                            :key="tag + Math.random() + ''"
                            v-for="tag in driverDimX2List"
                            class="selectiveBoxEl"
                            closable
                            :disable-transitions="true"
                            effect="dark"
                            @close="driverDimX2Clos(tag)"
                          >
                            <div class="selectiveBoxTag">{{ tag.name }}</div>
                          </el-tag>
                        </div>
                      </el-col>
                      <el-col
                        v-if="saveFormStatic.driverDimX == '3'"
                        :span="8"
                        style="padding-right: 8px"
                      >
                        <div class="elSelectiveBox">
                          <el-select
                            v-model="saveFormStatic.driverDimX3"
                            style="width: 100px"
                            placeholder="请选择"
                            @change="onChangeProgramX3()"
                            :disabled="popupWindowType == '3'"
                          >
                            <el-option
                              v-for="item in dropDownOptions"
                              :key="item.dictCode"
                              :label="item.dictName"
                              :value="item.dictCode"
                              v-show="
                                item.dictCode == saveFormStatic.driverDimX3 ||
                                !selectIdsArrX.includes(item.dictCode)
                              "
                            ></el-option>
                          </el-select>
                          <el-tag
                            style="cursor: pointer"
                            @click="
                              driverDimX3Change(saveFormStatic.driverDimX3)
                            "
                          >选择</el-tag>
                        </div>
                        <div class="selectiveBox">
                          <el-tag
                            :key="tag + Math.random() + ''"
                            v-for="tag in driverDimX3List"
                            class="selectiveBoxEl"
                            closable
                            :disable-transitions="true"
                            effect="dark"
                            @close="driverDimX3Clos(tag)"
                          >
                            <div class="selectiveBoxTag">{{ tag.name }}</div>
                          </el-tag>
                        </div>
                      </el-col>
                    </el-row>
                  </el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="百分比:" prop="percentCheck">
                    <el-radio-group
                      v-model="saveFormStatic.percentCheck"
                      :disabled="popupWindowType == '3'"
                    >
                      <el-radio label="0">百分比</el-radio>
                      <el-radio label="1">折算百分比</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="因子表:">
                    <el-upload
                      action
                      ref="upload"
                      :show-file-list="false"
                      :http-request="importStaticValue"
                      :before-upload="handleBeforeUpload"
                      name="file"
                      style="display: inline-block; margin-left: 10px"
                      accept=".xls"
                    >
                      <el-link
                        v-if="
                          popupWindowType != '3' &&
                          xJson.length != 0 &&
                          yJson.length != 0
                        "
                        type="primary"
                        style="margin-right: 10px"
                        size="small"
                      >导入</el-link>
                      <!-- <span style="color:red;font-size:10px;">*导入模板数据不匹配数据会清空</span> -->
                    </el-upload>
                    <div>
                      <c-table
                        :xJson="xJson"
                        :yJson="yJson"
                        :tableValue="tableValue"
                        :readonly="popupWindowType == '3'"
                        v-if="ctableShow"
                        ref="cTable"
                        style="width: 100%"
                      ></c-table>
                    </div>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <!-- 动态动因 -->
          <div v-if="saveForm.driverType == '0' ? false : true">
            <el-row>
              <el-col :span="24">
                <div class="dynamicTitle">
                  操作目标
                  <span style="font-weight: 100; font-size: 12px; color: red">(*从左到右依次选择)</span>
                </div>
              </el-col>
              <el-col :span="24">
                <el-form
                  :model="saveFormDynamic"
                  ref="saveFormDynamic"
                  :rules="saveFormDynamicRules"
                  label-width="120px"
                  :disabled="popupWindowType == '3'"
                >
                  <el-row>
                    <el-col :span="6">
                      <el-form-item label="动因数据表：" prop="pubPhysicaltableId">
                        <el-select
                          v-model="saveFormDynamic.pubPhysicaltableId"
                          @change="pubTableChange1"
                          placeholder="请选择"
                          :disabled="popupWindowType == '3'"
                        >
                          <el-option
                            v-for="item in pubTableOptions"
                            :key="item.tableNameEn"
                            :label="item.tableNameCn + '--' + item.tableNameEn"
                            :value="item.tableNameEn"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label="动因数值字段：" prop="pubPhysicalcolumnId">
                        <el-select
                          v-model="saveFormDynamic.pubPhysicalcolumnId"
                          @change="pubColumnChange"
                          placeholder="请选择"
                          :disabled="popupWindowType == '3'"
                        >
                          <el-option
                            v-for="item in pubColumnOptions"
                            :key="item.columnEn"
                            :label="item.columnCn"
                            :value="item.columnEn"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6" v-if="drverTypeFlag">
                      <el-form-item label="动因类别：" prop="relatedPubDriver">
                        <el-select v-model="saveFormDynamic.relatedPubDriver" placeholder="请选择">
                          <el-option
                            v-for="item in pubDriverOptions"
                            @change="pubDriverChange"
                            :key="item.driverCode"
                            :label="item.driverName"
                            :value="item.driverCode"
                            :disabled="popupWindowType == '3'"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6">
                      <el-form-item label label-width="32px" prop="driverOperatorType">
                        <el-radio-group
                          v-model="saveFormDynamic.driverOperatorType"
                          :disabled="popupWindowType == '3'"
                        >
                          <el-radio :label="'1'">求占比</el-radio>
                          <el-radio :label="'2'">简单比例</el-radio>
                        </el-radio-group>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form>
              </el-col>
              <el-col :span="24">
                <div class="dynamicTitle">筛选条件</div>
              </el-col>
              <el-col :span="24">
                <div
                  style="
                    height: 180px;
                    overflow: auto;
                    overflow-x: hidden;
                    margin-bottom: 20px;
                  "
                >
                  <el-row style="font-size: 13px; margin-bottom: 10px">
                    <el-col :span="7">
                      <p>维度</p>
                    </el-col>
                    <el-col :span="11">
                      <p>值</p>
                    </el-col>

                    <el-col :span="6">
                      <p>描述</p>
                    </el-col>
                  </el-row>
                  <el-row
                    v-for="(item, index) in selectConditionList"
                    :key="index"
                    style="margin-top: 10px"
                  >
                    <el-col :span="7">
                      <span style="line-height: 25px">{{ item.columnCn }}</span>
                    </el-col>
                    <el-col :span="5">
                      <!-- <el-input readonly v-model="item.filterName"></el-input> -->
                      <el-select
                        v-model="item.filterValue"
                        placeholder="请选择"
                        style="width: 100%"
                        :disabled="popupWindowType == '3'"
                      >
                        <el-option
                          v-for="itval in item.filterValueList"
                          :key="itval.filterValue"
                          :label="itval.filterName"
                          :value="itval.filterValue"
                        ></el-option>
                      </el-select>
                    </el-col>
                    <el-col :span="6">
                      <el-button
                        style="min-width: 60px; min-height: 26px"
                        @click.native="toSelectTab(item, index)"
                        :disabled="popupWindowType == '3'"
                      >选择</el-button>
                    </el-col>
                    <el-col :span="6">
                      <!-- <span style="line-height: 25px">{{
                        item.filterValue
                      }}</span>-->
                      <span
                        v-if="item.selectionFlag != '1'"
                        style="line-height: 25px"
                      >{{ item.filterValue }}</span>
                      <span
                        v-if="item.selectionFlag == '1'"
                        style="line-height: 25px"
                      >{{ item.filterValue.split('@@@')[0] }}</span>
                    </el-col>
                  </el-row>
                </div>
              </el-col>
              <el-col :span="24">
                <div class="dynamicTitle">过滤器</div>
              </el-col>
              <el-col :span="24">
                <el-form :model="saveFormFilter" ref="saveFormFilter" :rules="saveFormFilterRules">
                  <el-row>
                    <el-col :span="8">
                      <el-form-item label="过滤器类型：" label-width="120px" prop="isPubfilter">
                        <el-radio-group
                          v-model="saveFormFilter.isPubfilter"
                          @change="filterTypeChange"
                          :disabled="popupWindowType == '3'"
                        >
                          <el-radio :label="'0'">不使用</el-radio>
                          <el-radio :label="'1'">使用</el-radio>
                        </el-radio-group>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8" v-if="saveFormFilter.isPubfilter == '1' ? true : false">
                      <el-form-item prop="filterId">
                        <div
                          class="filterDataClick"
                          @click="filterBtn"
                          :disabled="popupWindowType == '3'"
                        >*过滤器：</div>
                        <el-select
                          v-model="saveFormFilter.filterId"
                          placeholder="请选择"
                          :disabled="popupWindowType == '3'"
                        >
                          <el-option
                            v-for="item in filterOptions"
                            :key="item.filterId"
                            :label="item.filterName"
                            :value="item.filterId"
                          ></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form>
              </el-col>
            </el-row>
          </div>
        </el-tab-pane>
      </el-tabs>
      <div slot="footer">
        <el-button @click="confirmTne" :disabled="popupWindowType == '3'">确 定</el-button>
        <el-button @click="cancelTne">取 消</el-button>
      </div>
      <!-- 过滤器 -->
      <filterTem
        :editTheData="editTheDataFilter"
        :dialogVisibleFilterProps="dialogVisibleFilter"
        @getDialogVisibleFilter="getDialogVisibleFilter"
      ></filterTem>
      <!-- 所有成员、关系树展示-->
      <div v-if="toShowMemberTree">
        <memberAndTree
          ref="memberAndTree"
          :toShowMemberTree="toShowMemberTree"
          :dictCode="dictCode"
          :indexItems="indexItems"
          :itemData="itemData"
          :mulSelect="mulSelect"
          @selectDataFunc="selectDataFunc"
        ></memberAndTree>
      </div>
      <!-- <filterPage :toShowFilterPage="toShowFilterPage"></filterPage> -->
      <!-- 定位的备注 -->
      <div class="remark" v-if="popupWindowType && popupWindowType == '2'">
        <div class="img">
          <img src="@/assets/images/remark.png" alt="remark" @click="toShowRemark" />
          <p>备注</p>
        </div>
        <div class="ramarkTable" v-if="toShowRemarkDetails">
          <ca-rule-remark
            :blockType="blockType"
            :toShowRemarkDetails="toShowRemarkDetails"
            :ruleCode="ruleDriverCode"
          ></ca-rule-remark>
        </div>
      </div>
    </el-dialog>
  </div>
</template>


<script>
// 获取维度
import { publicManage_pub } from "@/api/index";

//跳转form表单
import filterTem from "./filterTem";

//金融工具表 过滤器
import { publicManage_dat } from "@/api/index";
//动因类别
import { caPubDriver } from "@/api/index";
//规则定义字段维度
import { ruleDefinition } from "@/api/index";
//分摊动因
import { caRuleDriverApi } from "@/api/index";
//生成编码
import { pubSysparamList } from "@/api/index";
//成员 关系树
import memberAndTree from "@/components/ca/memberAndTree";
// 备注
import caRuleRemark from "@/components/ca/caRuleRemark";
// 引入因子表格
// import TableCom from '@/components/ca/table'
import cTable from "@/components/ca/table/complexTable";

export default {
  name: "ruleDriverForm",
  components: {
    filterTem,
    memberAndTree,
    caRuleRemark,
    cTable
    // TableCom
  },
  props: {
    //按钮类型
    popupWindowType: {
      type: String,
      default: ""
    },
    //弹窗开关
    dialogVisibleProps: {
      type: Boolean,
      default: false
    },
    //编辑数据
    editTheData: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      mulSelect: false,
      referenceId: false, // 数据是否被引用
      exportShow: false,
      xCol: 0,
      titleName: "新增动因",
      isClickFlag: "1", //未点击动因详情 复制
      editTheDataFilter: {},
      dialogVisibleFilter: false,
      //TAB数据切换
      activeName: "basicInformation",
      ctableShow: false,
      //基本信息保存信息校验
      saveFormRules: {
        driverCode: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        driverName: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          },
          {
            pattern: /^[\u4e00-\u9fa5_a-zA-Z0-9]{1,20}$/g,
            message: "请输入1-20位的汉字,大小写字母,下划线,数字",
            trigger: "change"
          },
          { validator: this.drverNameValid, trigger: "blur" }
        ],
        driverAuthority: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        driverType: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ]
      },
      //基本信息保存数据
      saveForm: {
        driverCode: "",
        driverName: "",
        driverAuthority: "1",
        driverType: "",
        driverDesc: ""
      },
      //弹窗开关
      dialogVisible: false,
      // 静态动因 #########################################################################################################
      // 表格
      selectIdsArr: [], // y下拉对比值
      selectIdsArrX: [], // x下拉对比值
      tableValue: [],
      xJson: [],
      yJson: [],
      //保存信息
      // 回显的数据
      indexItems: "", // 选择的标示
      datas: {
        entity: {
          creator: null,
          createdTm: null,
          modifier: null,
          modifiedTm: null,
          driverCode: "19042900002",
          driverName: "静态动因111",
          driverAuthority: "0",
          driverType: "0",
          driverDimX: "2",
          driverDimY: "2",
          driverDimX1: "00001",
          driverDimX2: "00003",
          driverDimX3: null,
          driverDimY1: "00001",
          driverDimY2: "00003",
          driverDimY3: null,
          percentCheck: "0",
          driverDesc: null
        },
        tableValue: [
          // {
          //   v: 0,
          //   x: "GRP006@@@TX002",
          //   y: "GRP002@@@TX002"
          // }
        ]
      },
      saveFormStatic: {
        driverDimX: "1",
        driverDimX1: "",
        driverDimX2: "",
        driverDimX3: "",
        tableValue: "",
        driverDimY: "1", // 默认选中的层级
        driverDimY1: "",
        driverDimY2: "",
        driverDimY3: "",
        //百分比折算百分比
        percentCheck: "0", // 默认百分比
        //基本信息CODE
        driverCode: "",
        //基本信息类型
        driverType: "1",
        copyCode: "",
        datafilterId: ""
      },

      driverDimYList: [
        {
          dictCode: "01",
          dictName: "标签1"
        },
        {
          dictCode: "02",
          dictName: "标签2"
        }
      ],
      saveFormStaticRules: {
        dimXValue: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        driverDimY: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        driverDimX: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        percentCheck: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ]
      },
      //目标层级下拉
      tierOptions: [
        {
          value: "1",
          label: "一层级"
        },
        {
          value: "2",
          label: "二层级"
        },
        {
          value: "3",
          label: "三层级"
        }
      ],
      dropDownOptions: [],
      dropDownOptionsX1: [],
      dropDownOptionsX2: [],
      dropDownOptionsX3: [],
      dropDownOptionsY1: [],
      dropDownOptionsY2: [],
      dropDownOptionsY3: [],
      driverDimX1List: [],
      driverDimX2List: [],
      driverDimX3List: [],
      driverDimY1List: [],
      driverDimY2List: [],
      driverDimY3List: [],
      driverDimXData: [
        {
          driverDimXId: "0",
          //选择数据
          driverDimXCode: "2",
          //列表数据
          driverDimXList: [],
          //切换下拉方法
          driverDimXChge: this.driverDimX1Chge,
          //打开弹窗方法
          driverDimXFunc: this.driverDimX1Func,
          //删除列表数据
          driverDimXClos: this.driverDimX1Clos
        },

        {
          driverDimXId: "1",
          //选择数据
          driverDimXCode: "2",
          //列表数据
          driverDimXList: [],
          //切换下拉方法
          driverDimXChge: this.driverDimX1Chge,
          //打开弹窗方法
          driverDimXFunc: this.driverDimX1Func,
          //删除列表数据
          driverDimXClos: this.driverDimX1Clos
        },
        {
          driverDimXId: "2",
          //选择数据
          driverDimXCode: "2",
          //列表数据
          driverDimXList: ["标签二", "标签三"],
          driverDimYList: ["标签二", "标签三"],
          //切换下拉方法
          driverDimXChge: this.driverDimX1Chge,
          //打开弹窗方法
          driverDimXFunc: this.driverDimX1Func,
          //删除列表数据
          driverDimXClos: this.driverDimX1Clos
        }
      ],
      driverDimYData: [
        {
          driverDimYId: "0",
          //选择数据
          driverDimYCode: "2",
          //列表数据
          driverDimYList: ["标签二", "标签三"],
          //切换下拉方法
          driverDimYChge: this.driverDimY1Chge,
          //打开弹窗方法
          driverDimYFunc: this.driverDimY1Func,
          //删除列表数据
          driverDimYClos: this.driverDimY1Clos
        },
        {
          driverDimYId: "1",
          //选择数据
          driverDimYCode: "2",
          //列表数据
          driverDimYList: ["标签二", "标签三"],
          //切换下拉方法
          driverDimYChge: this.driverDimY1Chge,
          //打开弹窗方法
          driverDimYFunc: this.driverDimY1Func,
          //删除列表数据
          driverDimYClos: this.driverDimY1Clos
        },
        {
          driverDimYId: "2",
          //选择数据
          driverDimYCode: "2",
          //列表数据
          driverDimYList: ["标签二", "标签三"],
          //切换下拉方法
          driverDimYChge: this.driverDimY1Chge,
          //打开弹窗方法
          driverDimYFunc: this.driverDimY1Func,
          //删除列表数据
          driverDimYClos: this.driverDimY1Clos
        }
      ],
      tableData: [],
      // 静态动因 #########################################################################################################
      //静态动因头部信息
      saveFormDynamic: {
        //动因数据表
        pubPhysicaltableId: "",
        //动因数值字段
        pubPhysicalcolumnId: "",
        //动因类别
        relatedPubDriver: "",
        driverOperatorType: "1"
      },
      //静态动因头部信息校验
      saveFormDynamicRules: {
        pubPhysicaltableId: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        pubPhysicalcolumnId: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        relatedPubDriver: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        driverOperatorType: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ]
      },
      //动因数据表下拉信息
      pubTableOptions: [],
      //动因数值字段下拉信息
      pubColumnOptions: [],
      //动因类别下拉信息
      pubDriverOptions: [],
      //动因类别展示情况
      drverTypeFlag: false,

      //筛选条件 --  维度与树的弹框
      //维度树弹框展示
      toShowMemberTree: false,
      //筛选维度值
      dictCode: "",
      //关联维度索引
      indexItems: 0,
      //选中的值
      itemData: [],
      //编辑回显是帅选维度的值
      selectData: [],
      //筛选条件------结束

      //筛选条件 页面展示数据
      selectConditionList: [],
      //维度数据列表
      dimensionalityTableData: [],
      //过滤器信息
      saveFormFilter: {},
      //过滤器下拉
      filterOptions: [],
      saveFormFilterRules: {
        isPubfilter: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ],
        filterId: [
          {
            required: true,
            message: "该输入项为必输项",
            trigger: "blur"
          }
        ]
      },
      //##########定位 ##############
      toShowRemarkDetails: false,
      blockType: "ruleDriver", // 规则定义是ruleBase,分摊动因是ruleDriver
      ruleDriverCode: ""
    };
  },
  computed: {},
  watch: {
    activeName(val) {
      this.handleClick({ name: val });
    },
    editTheData(val) {
      console.log(val), "分摊动因";
    },
    dialogVisibleProps(val) {
      this.dialogVisible = val;
      if (this.dialogVisible) {
        this.$nextTick(() => {
          this.init();
        });
      }
    },
    dialogVisible(val) {
      this.$emit("getDialogVisible", val);
    },
    toShowMemberTree: function() {
      let _self = this;
      if (this.toShowMemberTree) {
        this.$nextTick(() => {
          _self.$refs.memberAndTree.init();
        });
      }
    }
  },
  created() {},
  mounted() {
    this.dialogVisible = this.dialogVisibleProps;
    if (this.dialogVisible) {
      this.$nextTick(() => {
        this.init();
      });
    }
  },
  beforeUpdate() {},
  methods: {
    //初始化方法
    init() {
      //判断是titleName
      switch (this.popupWindowType) {
        case "1":
          this.titleName = "新增分摊动因";
          break;
        case "2":
          this.titleName = "编辑分摊动因";
          break;
        case "3":
          this.titleName = "查看分摊动因";
          break;
        default:
          this.titleName = "复制分摊动因";
          break;
      }
      this.activeName = "basicInformation";
      //清空上次显示的值
      this.saveForm = {};
      this.saveFormDynamic = {};
      this.saveFormFilter = {};
      for (let i in this.saveFormStatic) {
        this.saveFormStatic[i] = "";
      }
      this.toShowMemberTree = false;
      this.saveFormStatic.driverType = "1";
      this.saveFormStatic.percentCheck = "0"; // 1231
      this.saveFormStatic.driverDimY = "1";
      this.saveFormStatic.driverDimX = "1";
      this.referenceId = false;
      // 置空静音表格
      this.exportShow = false;
      this.selectIdsArrX = [];
      this.selectIdsArr = [];
      this.driverDimY1List = [];
      this.driverDimY2List = [];
      this.driverDimY3List = [];
      this.driverDimX1List = [];
      this.driverDimX2List = [];
      this.driverDimX3List = [];
      this.xJson = [];
      this.yJson = [];
      this.tableValue = [];
      this.ctableShow = false;
      this.getStaticOptions();
      //判断是否是新增
      //筛选维度滞空
      this.selectConditionList = [];
      if (this.popupWindowType == "1") {
        //初始化数据
        this.$set(this.saveForm, "driverCode", this.editTheData.driverCode);
        this.$set(this.saveForm, "driverType", "1");
        this.$set(this.saveForm, "driverAuthority", "0");
        this.$set(this.saveFormDynamic, "driverOperatorType", "1");
        this.$set(this.saveFormFilter, "isPubfilter", "0");
      } else {
        this.backShowData();
      }
    },
    //编辑页面跳转时的数据回显
    backShowData() {
      let params = {
        driverCode: this.editTheData.driverCode,
        operateType: this.popupWindowType
      };
      if (this.popupWindowType == "2") {
        let params = {
          ids: [this.editTheData.driverCode]
        };
        caRuleDriverApi.ruleDrivercheckIsRemove(params).then(res => {
          if (null == res.data || "" == res.data) {
            // 没有被引用
            this.referenceId = false;
          } else {
            // 被引用不能选择类型
            this.referenceId = true;
          }
        });
      }

      caRuleDriverApi
        .ruleDriverBackDataShow(params)
        .then(reslt => {
          if (reslt.code == 200) {
            //返回基础信息
            this.saveForm = reslt.datas.entity;

            //复制需 新的动因编码
            if (this.popupWindowType == "5") {
              this.saveForm.driverCode = this.editTheData.copyCode;
            }
            //判断一下回显数据是动因类型
            if (reslt.datas.entity.driverType == "1") {
              //操作目标
              this.saveFormDynamic = reslt.datas.detailEntity;

              //过滤器赋值
              this.saveFormFilter = reslt.datas.detailEntity;
              console.log(this.saveFormFilter, "过滤器赋值");
              //执行 数据回显
              this.pubTableChange(this.saveFormDynamic.pubPhysicaltableId);
            }
            // 静因场景
            if (reslt.datas.entity.driverType == "0") {
              // 获取下拉框的数据及选中的值
              // this.getStaticOptions(reslt.datas.tableValue)
              this.getDictItem(reslt.datas.tableValue);
              // 层级显示
              this.saveFormStatic = reslt.datas.entity;
              if (reslt.datas.dimX1Options) {
                this.driverDimX1List = reslt.datas.dimX1Options;
              }
              if (reslt.datas.dimX2Options) {
                this.driverDimX2List = reslt.datas.dimX2Options;
              }
              if (reslt.datas.dimX3Options) {
                this.driverDimX3List = reslt.datas.dimX3Options;
              }
              if (reslt.datas.dimY1Options) {
                this.driverDimY1List = reslt.datas.dimY1Options;
              }
              if (reslt.datas.dimY2Options) {
                this.driverDimY2List = reslt.datas.dimY2Options;
              }
              if (reslt.datas.dimY3Options) {
                this.driverDimY3List = reslt.datas.dimY3Options;
              }
              this.onChangeProgram();
              this.onChangeProgramX();
              // 构建表格
              this.toGetGenerateTable();
              this.tableValue = reslt.datas.tableValue;
              console.log(
                this.saveFormStatic.driverDimX,
                this.saveFormStatic.driverDimX1
              );
            }
            //给备注绑定规则定义
            this.ruleDriverCode = this.saveForm.driverCode;

            this.toShowRemarkDetails = false;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },

    drverNameValid(rule, value, callback) {
      let params = {
        driverCode: this.saveForm.driverCode,
        driverName: value,
        operateType: this.popupWindowType
      };
      caRuleDriverApi.checkIsExistDriverName(params).then(res => {
        if (res.code == 200 && !res.data) {
          callback(new Error("动因名称已存在"));
          this.$message.warning("动因名称已存在");
        } else {
          callback();
        }
      });
    },
    //数据回显值方法集合
    backFuncionColl() {
      //操作类型不为新增的时候  所有的值
      if (this.popupWindowType != "1" && this.saveForm.driverType == "1") {
        //判断是否使用了过滤器
        if (this.saveFormFilter.isPubfilter == "1") {
          this.getFilterDataSelects();
          console.log("判断是否使用了过滤器");
        }
      }
    },
    //弹窗关闭触发
    handleClose(done) {
      done();
    },
    //切换Tabs触发
    handleClick(tab) {
      if (tab.name === "agentInformation") {
        //获取物理表数据
        this.isClickFlag = "2";
        let params = {
          isModule: "0", // 不是模板表
          moduleCode: "ca", //分摊模块
          status: "2" //已经发布
        };
        publicManage_dat
          .fundToolTableQueryListCa(params)
          .then(res => {
            console.log(res, "物理表数据");
            if ((res.code = 200)) {
              this.pubTableOptions = res.datas;
              console.log(tab.name, "tab.name");
            } else {
              this.$message({
                type: "error",
                message: "动因数据表无关联数据"
              });
            }
          })
          .catch(res => {
            console.log(res);
          });
      }
    },
    //切换动因触发
    radioChange(val) {
      console.log(val);
      if (val == "0") {
        if (this.popupWindowType == "1") {
          this.saveFormStatic.driverDimY = "1";
          this.saveFormStatic.driverDimX = "1";
          this.saveFormStatic.percentCheck = "0";
        }
      }
    },
    //取消按钮
    cancelTne() {
      this.dialogVisible = false;
    },
    // 静态动因 #########################################################################################################
    // 导入静因的值
    // 导入前
    // getTotal(val){
    //   console.log(val,'111')
    //   if(val>1){
    //     this.$message.warning("合计不能超过1")

    //   }
    // },
    handleBeforeUpload(file) {
      var name = file.name;
      var type = name.substring(name.lastIndexOf("."), name.length);
      if (type === ".xls") {
        return true;
      }
      this.$message("只能选择xls格式的文件上传");
      return false;
    },

    importStaticValue(item) {
      let form = new FormData();
      // 文件对象
      form.append("upload", item.file);
      console.log(
        this.driverDimX1List,
        this.driverDimX2List.length,
        this.driverDimX3List.length
      );
      this.xCol = 0;
      if (
        this.driverDimX1List.length >= 1 &&
        this.driverDimX2List.length >= 1 &&
        this.driverDimX3List.length >= 1
      ) {
        this.xCol =
          this.driverDimX1List.length *
            this.driverDimX2List.length *
            this.driverDimX3List.length +
          Number(this.saveFormStatic.driverDimY);
      }
      if (
        this.driverDimX1List.length >= 1 &&
        this.driverDimX2List.length >= 1 &&
        !this.driverDimX3List.length >= 1
      ) {
        this.xCol =
          this.driverDimX1List.length * this.driverDimX2List.length +
          Number(this.saveFormStatic.driverDimY);
      }
      if (
        this.driverDimX1List.length >= 1 &&
        !this.driverDimX2List.length >= 1 &&
        !this.driverDimX3List.length >= 1
      ) {
        this.xCol =
          this.driverDimX1List.length + Number(this.saveFormStatic.driverDimY);
      }

      form.append("XCols", this.saveFormStatic.driverDimX);
      form.append("YCols", this.saveFormStatic.driverDimY);
      form.append("dataCols", this.xCol);
      caRuleDriverApi.importStatic(form).then(response => {
        if (response.code == "200" && response.success) {
          let importTableValue = [];
          importTableValue = response.data.tableValue;
          if ((importTableValue.length = this.tableValue.length)) {
            for (let i = 0; i < importTableValue.length; i++) {
              if (
                importTableValue[i].x == this.tableValue[i].x &&
                importTableValue[i].y == this.tableValue[i].y
              ) {
                i++;
              } else {
                this.$message.warning("请导入正确模板");
                this.$refs.upload.clearFiles();
                return;
              }
              this.tableValue = importTableValue;
              this.$refs.upload.clearFiles();
            }
          } else {
            this.$message.warning("请导入正确模板");
          }
          // this.tableValue = response.data.tableValue;
          // this.$refs.upload.clearFiles();
        } else {
          this.$message.error(res.message);
          this.$refs.upload.clearFiles();
        }
      });
    },
    // 切换源选择
    driverDimYOptions() {
      // this.selectIdsArr = [];
      // saveFormStatic.driverDimY
    },
    // 切换选中的值
    // x轴
    onChangeProgramX1() {
      this.onChangeProgramX();
      this.driverDimX1List = [];
    },
    onChangeProgramX2() {
      this.onChangeProgramX();
      this.driverDimX2List = [];
    },
    onChangeProgramX3() {
      this.onChangeProgramX();
      this.driverDimX3List = [];
    },
    // y轴
    onChangeProgramY1() {
      this.onChangeProgram();
      this.driverDimY1List = [];
    },
    onChangeProgramY2() {
      this.onChangeProgram();
      this.driverDimY2List = [];
    },
    onChangeProgramY3() {
      this.onChangeProgram();
      this.driverDimY3List = [];
    },
    onChangeProgram() {
      this.selectIdsArr = [];
      if (this.saveFormStatic.driverDimY1) {
        this.selectIdsArr.push(this.saveFormStatic.driverDimY1);
      }
      if (this.saveFormStatic.driverDimY2) {
        this.selectIdsArr.push(this.saveFormStatic.driverDimY2);
      }
      if (this.saveFormStatic.driverDimY3) {
        this.selectIdsArr.push(this.saveFormStatic.driverDimY3);
      }
    },
    // x轴
    onChangeProgramX() {
      this.selectIdsArrX = [];
      if (this.saveFormStatic.driverDimX1) {
        this.selectIdsArrX.push(this.saveFormStatic.driverDimX1);
      }
      if (this.saveFormStatic.driverDimX2) {
        this.selectIdsArrX.push(this.saveFormStatic.driverDimX2);
      }
      if (this.saveFormStatic.driverDimX3) {
        this.selectIdsArrX.push(this.saveFormStatic.driverDimX3);
      }
    },

    // 获取下拉框的值
    getStaticOptions() {
      // 接口暂时缺少下拉框的值
      publicManage_pub.dimDicttypeListQuery().then(res => {
        if (res.code == 200) {
          this.dropDownOptions = res.data;
        }
      });
      // 下拉框下面的值
      if (this.popupWindowType != "1") {
        this.getDictItem();
      }
    },
    // 获取下拉框下的输入框选中的值
    getDictItem() {
      if (this.driverDimY) {
        let params = {
          dictItemCodes: "",
          driverCode: this.driverDimY
        };
        caRuleDriverApi.ruleDriverFindDictitem().then(res => {
          if (res.code == 200) {
            this.driverDimY1List = res.data;
          }
        });
      }
    },

    toGetGenerateTable() {
      this.ctableShow = false;
      this.xJson = [];
      this.yJson = [];
      console.log(
        this.driverDimY1List,
        this.driverDimY1List,
        this.driverDimY1List
      );
      if (this.driverDimY1List.length >= 1) {
        this.yJson.push(this.driverDimY1List);
      }
      if (this.driverDimY2List.length >= 1) {
        this.yJson.push(this.driverDimY2List);
      }
      if (this.driverDimY3List.length >= 1) {
        this.yJson.push(this.driverDimY3List);
      }
      if (this.driverDimX1List.length >= 1) {
        this.xJson.push(this.driverDimX1List);
      }
      if (this.driverDimX2List.length >= 1) {
        this.xJson.push(this.driverDimX2List);
      }
      if (this.driverDimX3List.length >= 1) {
        this.xJson.push(this.driverDimX3List);
      }
      console.log(this.yJson, this.xJson, "this.xJsonthis.yjson");
      this.tableValue = [];
      this.ctableShow = true;
      this.$forceUpdate();
    },
    //删除列表数据
    driverDimX1Clos(tag) {
      if (this.popupWindowType == "3") {
        return;
      }
      //
      this.$confirm("你确定要删除这条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.driverDimX1List.splice(this.driverDimX1List.indexOf(tag), 1);
          this.toGetGenerateTable();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消选择"
          });
        });

      //
    },
    //删除列表数据
    driverDimX2Clos(tag) {
      if (this.popupWindowType == "3") {
        return;
      }
      //
      this.$confirm("你确定要删除这条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.driverDimX2List.splice(this.driverDimX2List.indexOf(tag), 1);
          this.toGetGenerateTable();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消选择"
          });
        });

      //
    },
    //删除列表数据
    driverDimX3Clos(tag) {
      if (this.popupWindowType == "3") {
        return;
      }
      //
      this.$confirm("你确定要删除这条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.driverDimX3List.splice(this.driverDimX3List.indexOf(tag), 1);
          this.toGetGenerateTable();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消选择"
          });
        });
      //
    },
    //删除列表数据
    driverDimY1Clos(tag) {
      if (this.popupWindowType == "3") {
        return;
      }
      //
      this.$confirm("你确定要删除这条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.driverDimY1List.splice(this.driverDimY1List.indexOf(tag), 1);
          this.toGetGenerateTable();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消选择"
          });
        });

      //
    },
    //删除列表数据
    driverDimY2Clos(tag) {
      if (this.popupWindowType == "3") {
        return;
      }
      //
      this.$confirm("你确定要删除这条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.driverDimY2List.splice(this.driverDimY2List.indexOf(tag), 1);
          this.toGetGenerateTable();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消选择"
          });
        });
      //
    },
    //删除列表数据
    driverDimY3Clos(tag) {
      if (this.popupWindowType == "3") {
        return;
      }
      //
      this.$confirm("你确定要删除这条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.driverDimY3List.splice(this.driverDimY3List.indexOf(tag), 1);
          this.toGetGenerateTable();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消选择"
          });
        });

      //
    },
    //切换下拉方法
    driverDimX1Chge(val) {
      console.log(val, "切换下拉方法");
    },
    //打开弹窗方法
    driverDimX1Func(val) {
      console.log(val, "打开弹窗方法");
    },
    //切换下拉方法
    driverDimY1Chge(val) {
      console.log(val, "切换下拉方法");
    },
    driverDimY1Change(item) {
      if (this.popupWindowType == "3") {
        return;
      }
      if (!item) {
        this.$message.warning("请选择下拉框的值");
        return;
      }
      console.log(item, "item1181");
      // 打开树和成员组件
      this.toShowMemberTree = true;
      this.mulSelect = true;
      this.dictCode = item;
      this.indexItems = 0;
      this.itemData = this.driverDimY1List.map(v => {
        return v.code;
      });
      this.$nextTick(() => {
        this.$refs.memberAndTree.init();
      });
    },
    driverDimY2Change(item) {
      if (this.popupWindowType == "3") {
        return;
      }
      if (!item) {
        this.$message.warning("请选择下拉框的值");
        return;
      }
      console.log(item, "item1181");
      // 打开树和成员组件
      this.toShowMemberTree = true;
      this.mulSelect = true;
      this.dictCode = item;
      this.indexItems = 1;
      this.itemData = this.driverDimY2List.map(v => {
        return v.code;
      });
      this.$nextTick(() => {
        this.$refs.memberAndTree.init();
      });
      console.log(item);
    },
    driverDimY3Change(item) {
      if (this.popupWindowType == "3") {
        return;
      }
      if (!item) {
        this.$message.warning("请选择下拉框的值");
        return;
      }
      console.log(item, "item1181");
      // 打开树和成员组件
      this.toShowMemberTree = true;
      this.mulSelect = true;
      this.dictCode = item;
      this.indexItems = 2;
      this.itemData = this.driverDimY3List.map(v => {
        return v.code;
      });
      this.$nextTick(() => {
        this.$refs.memberAndTree.init();
      });
    },

    // 获取选择第一个框的值
    driverDimX1Change(item) {
      if (this.popupWindowType == "3") {
        return;
      }
      if (!item) {
        this.$message.warning("请选择下拉框的值");
        return;
      }
      console.log(item, "item1181");
      // 打开树和成员组件
      this.toShowMemberTree = true;
      this.mulSelect = true;
      this.dictCode = item;
      this.indexItems = 3;
      this.itemData = this.driverDimX1List.map(v => {
        return v.code;
      });
      let _self = this;
      this.$nextTick(() => {
        _self.$refs.memberAndTree.init();
      });
    },
    // 获取选择第一个框的值
    driverDimX2Change(item) {
      if (this.popupWindowType == "3") {
        return;
      }
      if (!item) {
        this.$message.warning("请选择下拉框的值");
        return;
      }
      console.log(item, "item1181");
      // 打开树和成员组件
      this.toShowMemberTree = true;
      this.mulSelect = true;
      this.dictCode = item;
      this.indexItems = 4;
      this.itemData = this.driverDimX2List.map(v => {
        return v.code;
      });
      let _self = this;
      this.$nextTick(() => {
        this.$refs.memberAndTree.init();
      });
    },
    // 获取选择第一个框的值
    driverDimX3Change(item) {
      if (this.popupWindowType == "3") {
        return;
      }
      if (!item) {
        this.$message.warning("请选择下拉框的值");
        return;
      }
      console.log(item, "item1181");
      // 打开树和成员组件
      this.toShowMemberTree = true;
      this.mulSelect = true;
      this.dictCode = item;
      this.indexItems = 5;
      this.itemData = this.driverDimX3List.map(v => {
        return v.code;
      });
      let _self = this;
      this.$nextTick(() => {
        _self.$refs.memberAndTree.init();
      });
    },
    // 静态动因 #########################################################################################################

    //动因数据表下拉
    // 物理表数据改变
    pubTableChange1(val) {
      this.$set(this.saveFormDynamic, "relatedPubDriver", "");
      this.$set(this.saveFormDynamic, "pubPhysicalcolumnId", "");
      this.$set(this.saveFormFilter, "filterId", "");
      this.selectConditionList = [];
      console.log(val, "物理表改变111111");
      this.pubTableChange(val);
    },
    pubTableChange(val) {
      //判断动因表是否展示
      console.log(val.indexOf("CA_REASON_INF"), "打开弹窗方法");
      if (!val.indexOf("CA_REASON_INF")) {
        //动因表
        this.drverTypeFlag = true;
        this.queryPubDriverList();
      } else {
        this.drverTypeFlag = false;
      }
      console.log(val, "金融工具表改变值");
      //获取金融工具表字段数据
      this.queryFoundColumnList(val);
      //获取筛选条件
      this.getDataFilterOptions(val);
      //判断过滤器是否使用
      if (this.saveFormFilter.isPubfilter == "1") {
        this.filterTypeChange(this.saveFormFilter.isPubfilter);
      }
    },
    //查询字段值
    queryFoundColumnList(value) {
      if (value == null && value == "") {
        return;
      }
      let dataSearch = {
        isShow: "1",
        isTemplate: "0",
        tableNameEn: value
      };
      publicManage_dat
        .fundToolColumnQueryListCa(dataSearch)
        .then(res => {
          if (res.code == 200) {
            console.log(res.datas, "业务字段金融工具表数据");
            this.pubColumnOptions = res.datas;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //查询动因类别
    queryPubDriverList() {
      caPubDriver.pubDriverQueryList({}).then(res => {
        if (res.code == 200) {
          console.log(res.datas, "金融工具表数据");
          this.pubDriverOptions = res.datas;
        }
      });
    },
    //动因数值字段下拉
    pubColumnChange(val) {
      console.log(val, "动因数值字段");
    },
    //动因类别下拉
    pubDriverChange(val) {
      console.log(val, "动因类别");
    },
    // 获取动态的筛选条件
    getDataFilterOptions(val) {
      let params = {
        isShow: "1",
        isTemplate: "0",
        tableNameEn: val
      };
      ruleDefinition
        .queryDimColumn(params)
        .then(res => {
          if (res.code == 200) {
            this.selectConditionList = res.datas;
            if (this.selectConditionList.length >= 1) {
              for (let i = 0; i < this.selectConditionList.length; i++) {
                this.$set(this.selectConditionList[i], "filterValue", "");
                this.$set(this.selectConditionList[i], "treeId", "");
                this.$set(this.selectConditionList[i], "selectionFlag", "-");
                this.$set(this.selectConditionList[i], "filterName", "所有");
                this.selectConditionList[i].selectionFlag = "-";
                this.selectConditionList[i].treeId = "";
                this.selectConditionList[i].filterValue = "";

                this.selectConditionList[i].filterValueList = [
                  {
                    filterValue: "",
                    filterName: "所有"
                  }
                ];
              }
              if (this.popupWindowType && this.popupWindowType != "1") {
                // 编辑查看复制获取回显的值
                this.getRuleBaseDetailGetDataFilter();
              }
            }
          } else {
            this.$message.error(res.message);
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    // 编辑查看复制 获取筛选条件动态选择框信息
    getRuleBaseDetailGetDataFilter() {
      let params = {
        datafilterId: this.saveFormFilter.datafilterId
      };
      ruleDefinition
        .ruleBaseDetailGetDataFilter(params)
        .then(res => {
          if (res.code === 200) {
            console.log(res.datas, "获取筛选条件动态选择框信息");
            this.selectData = res.datas;
            if (this.selectData.length) {
              for (let i = 0; i < this.selectData.length; i++) {
                for (let t = 0; t < this.selectConditionList.length; t++) {
                  if (
                    this.selectConditionList[t].columnEn ==
                    this.selectData[i].pubPhysicalcolumnId
                  ) {
                    if (this.selectData[i].selectionFlag == "1") {
                      this.selectConditionList[t].filterValue =
                        this.selectData[i].filterValue +
                        "@@@" +
                        this.selectData[i].treeId;
                    } else {
                      this.selectConditionList[t].filterValue = this.selectData[
                        i
                      ].filterValue;
                    }
                    this.selectConditionList[t].filterName = this.selectData[
                      i
                    ].filterName;
                    this.selectConditionList[t].selectionFlag = this.selectData[
                      i
                    ].selectionFlag;
                    this.selectConditionList[t].treeId = this.selectData[
                      i
                    ].treeId;
                    //
                    this.selectConditionList[t].filterValueList = [];
                    let val = {
                      filterName: this.selectConditionList[t].filterName,
                      filterValue: this.selectConditionList[t].filterValue
                    };
                    let param = {
                      filterName: "所有",
                      filterValue: ""
                    };
                    this.selectConditionList[t].filterValueList.push(param);
                    this.selectConditionList[t].filterValueList.push(val);
                  }
                  this.$forceUpdate();
                  console.log(
                    this.selectConditionList[t],
                    "selectConditionList[t]"
                  );
                }
              }
            }
          } else {
            this.$message({
              type: "error",
              message: res.message
            });
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    // 筛选维度 ----  选择弹框
    // updataMethods(val) {
    //   console.log(val, "332");
    //   item.filtervalue = this.$forceUpdate();
    // },
    //弹出选择框
    toSelectTab(item, index) {
      this.toShowMemberTree = true;
      this.mulSelect = false;
      this.indexItems = index;
      this.itemData = item.filterValueList.map(v => {
        return v.filterValue;
      });
      this.itemData = [item.filterValue];
      this.dictCode = item.relatedDimensionCode;
    },

    // 获取维度成员
    selectDataFunc(val) {
      this.toShowMemberTree = false;
      if (val) {
        if (this.saveForm.driverType == "1") {
          let params = val;
          console.log(params, "维度成员传输的传输的数据");
          if (params.selectionFlag == "2") {
            console.log(val, "维度成员传输的传输的数据2");
            let ind = params.index;
            this.selectConditionList[ind].filterValue = params.row.dictItemCode;
            this.selectConditionList[ind].filterName = params.row.dictItemName;
            this.selectConditionList[ind].selectionFlag = "2";
            let val = {
              filterName: params.row.dictItemName,
              filterValue: params.row.dictItemCode
            };
            this.selectConditionList[ind].filterValueList = [];
            let param = {
              filterName: "所有",
              filterValue: ""
            };
            this.selectConditionList[ind].filterValueList.push(param);
            this.selectConditionList[ind].filterValueList.push(val);
          }
          if (params.selectionFlag == "1") {
            let ind = params.index;
            this.selectConditionList[ind].filterValue = params.row.id;
            this.selectConditionList[ind].filterName = params.row.name;
            this.selectConditionList[ind].treeId = params.row.treeCode;
            this.selectConditionList[ind].selectionFlag = "1";
            let val = {
              filterValue: params.row.id,
              filterName: params.row.name
            };
            // this.selectConditionList[ind].filterValueList.push(val);
            this.selectConditionList[ind].filterValueList = [];
            let param = {
              filterName: "所有",
              filterValue: ""
            };
            this.selectConditionList[ind].filterValueList.push(param);
            this.selectConditionList[ind].filterValueList.push(val);
          }
          this.$forceUpdate();
        }
        // 静态动因
        if (this.saveForm.driverType == "0") {
          console.log(val, "传过来的值");
          console.log(val, "从外面传递过来的值");
          if (val.index == 0) {
            if (val.selectionFlag == "2") {
              let params = {
                code: val.row.dictItemCode,
                name: val.row.dictItemName
              };
              this.driverDimY1List.push(params);
            } else {
              // 1221
              for (let i = 0; i < val.row.length; i++) {
                let str = val.row[i].id.split("@@@");
                let params = {
                  code: str[0],
                  name: val.row[i].name
                };
                this.driverDimY1List.push(params);
              }
              //
              // let str = val.row.id.split("@@@")
              // let params = {
              //   code: str[0],
              //   name: val.row.name,
              // };
              // this.driverDimY1List.push(params);
            }
            // 去掉重复数据
            for (let i = 0; i < this.driverDimY1List.length; i++) {
              for (let j = i + 1; j < this.driverDimY1List.length; j++) {
                if (
                  this.driverDimY1List[i].code == this.driverDimY1List[j].code
                ) {
                  this.driverDimY1List.splice(j, 1);
                  j = j - 1;
                }
              }
            }
          }
          if (val.index == 1) {
            if (val.selectionFlag == "2") {
              let params = {
                code: val.row.dictItemCode,
                name: val.row.dictItemName
              };
              this.driverDimY2List.push(params);
            } else {
              // 1221
              for (let i = 0; i < val.row.length; i++) {
                let str = val.row[i].id.split("@@@");
                let params = {
                  code: str[0],
                  name: val.row[i].name
                };
                this.driverDimY2List.push(params);
              }
              //
              // let params = {
              //   code: val.row.id,
              //   name: val.row.name,
              // };
              // this.driverDimY2List.push(params);
            }
            for (let i = 0; i < this.driverDimY2List.length; i++) {
              for (let j = i + 1; j < this.driverDimY2List.length; j++) {
                if (
                  this.driverDimY2List[i].code == this.driverDimY2List[j].code
                ) {
                  this.driverDimY2List.splice(j, 1);
                  j = j - 1;
                }
              }
            }
          }
          if (val.index == 2) {
            if (val.selectionFlag == "2") {
              let params = {
                code: val.row.dictItemCode,
                name: val.row.dictItemName
              };
              this.driverDimY3List.push(params);
            } else {
              // 1221
              for (let i = 0; i < val.row.length; i++) {
                let str = val.row[i].id.split("@@@");
                let params = {
                  code: str[0],
                  name: val.row[i].name
                };
                this.driverDimY3List.push(params);
              }
              //
              // let params = {
              //   code: val.row.id,
              //   name: val.row.name,
              // };
              // this.driverDimY3List.push(params);
            }
            // this.driverDimY3List.push(params);
            for (let i = 0; i < this.driverDimY3List.length; i++) {
              for (let j = i + 1; j < this.driverDimY3List.length; j++) {
                if (
                  this.driverDimY3List[i].code == this.driverDimY3List[j].code
                ) {
                  this.driverDimY3List.splice(j, 1);
                  j = j - 1;
                }
              }
            }
          }
          if (val.index == 3) {
            if (val.selectionFlag == "2") {
              let params = {
                code: val.row.dictItemCode,
                name: val.row.dictItemName
              };
              this.driverDimX1List.push(params);
            } else {
              // 1221
              for (let i = 0; i < val.row.length; i++) {
                let str = val.row[i].id.split("@@@");
                let params = {
                  code: str[0],
                  name: val.row[i].name
                };
                this.driverDimX1List.push(params);
              }
              //
              // let params = {
              //   code: val.row.id,
              //   name: val.row.name,
              // };
              // this.driverDimX1List.push(params);
            }
            // this.driverDimX1List.push(params);
            for (let i = 0; i < this.driverDimX1List.length; i++) {
              for (let j = i + 1; j < this.driverDimX1List.length; j++) {
                if (
                  this.driverDimX1List[i].code == this.driverDimX1List[j].code
                ) {
                  this.driverDimX1List.splice(j, 1);
                  j = j - 1;
                }
              }
            }
          }
          if (val.index == 4) {
            if (val.selectionFlag == "2") {
              let params = {
                code: val.row.dictItemCode,
                name: val.row.dictItemName
              };
              this.driverDimX2List.push(params);
            } else {
              // 1221
              for (let i = 0; i < val.row.length; i++) {
                let str = val.row[i].id.split("@@@");
                let params = {
                  code: str[0],
                  name: val.row[i].name
                };
                this.driverDimX2List.push(params);
              }
              //
              // let params = {
              //   code: val.row.id,
              //   name: val.row.name,
              // };
              // this.driverDimX2List.push(params);
            }
            // this.driverDimX2List.push(params);
            for (let i = 0; i < this.driverDimX2List.length; i++) {
              for (let j = i + 1; j < this.driverDimX2List.length; j++) {
                if (
                  this.driverDimX2List[i].code == this.driverDimX2List[j].code
                ) {
                  this.driverDimX2List.splice(j, 1);
                  j = j - 1;
                }
              }
            }
          }
          if (val.index == 5) {
            if (val.selectionFlag == "2") {
              let params = {
                code: val.row.dictItemCode,
                name: val.row.dictItemName
              };
              this.driverDimX3List.push(params);
            } else {
              // 1221
              for (let i = 0; i < val.row.length; i++) {
                let str = val.row[i].id.split("@@@");
                let params = {
                  code: str[0],
                  name: val.row[i].name
                };
                this.driverDimX3List.push(params);
              }
              //
              // let params = {
              //   code: val.row.id,
              //   name: val.row.name,
              // };
              // this.driverDimX3List.push(params);
            }
            // this.driverDimX3List.push(params);
            for (let i = 0; i < this.driverDimX3List.length; i++) {
              for (let j = i + 1; j < this.driverDimX3List.length; j++) {
                if (
                  this.driverDimX3List[i].code == this.driverDimX3List[j].code
                ) {
                  this.driverDimX3List.splice(j, 1);
                  j = j - 1;
                }
              }
            }
          }
          // 生成表格
          this.toGetGenerateTable();
        }
      }
    },
    // 筛选维度 ----  选择弹框

    //维度下拉
    dimChange(val) {
      console.log(val, "维度下拉");
    },
    //打开选择值弹窗
    selectBtn(val) {
      val.dimOptions.push({
        value: "bgs",
        label: "办公室"
      });
      val.dimValueSelect = "";
      val.dimValueSelect = "bgs";
      this.$forceUpdate();
      console.log(val, "打开选择值弹窗");
    },
    getDialogVisibleFilter(val) {
      this.dialogVisibleFilter = val;
    },

    //*************过滤器 ************************* */
    filterTypeChange(val) {
      if (val == "1") {
        //下拉框筛选值
        this.getFilterDataSelects();
      }
    },
    //获取过滤器下拉框的值
    getFilterDataSelects() {
      //获取物理表的的过滤器的值
      let params = {
        tableName: this.saveFormDynamic.pubPhysicaltableId
      };
      ruleDefinition
        .pubFilterQueryComboForRule(params)
        .then(res => {
          if (res.code == 200 && res.success) {
            this.filterOptions = res.datas;
          } else {
            this.filterOptions = [];
            this.$message.error("过滤器" + res.message);
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //过滤器点击查看事件
    filterBtn() {
      //获取过滤器数据
      if (!this.saveFormFilter.filterId) {
        this.$message.warning("请选择过滤器");
        return;
      }
      let params = {
        id: this.saveFormFilter.filterId
      };
      publicManage_dat
        .pubFilterFindById(params)
        .then(res => {
          if (res.code == 200) {
            if (res.data) {
              this.dialogVisibleFilter = true;
              this.editTheDataFilter = res.data;
            } else {
              this.$message.warning("过滤器失效");
            }
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //确定按钮总保存
    confirmTne() {
      console.log(this.selectConditionList, "筛选维度的值");
      //基础信息校验
      this.$refs.saveForm.validate(valid => {
        if (valid) {
          //保存基础信息
          if (this.saveForm.driverType == "1") {
            this.$refs.saveFormDynamic.validate(vali => {
              this.$refs.saveFormFilter.validate(valiFilter => {
                if (vali && valiFilter) {
                  this.saveBasicRuleDriver();
                } else {
                  this.activeName = "agentInformation";
                  this.$message.warning("动因信息不全！");
                }
              });
            });
          }
          if (this.saveForm.driverType == "0") {
            this.$refs.saveFormStatic.validate(vali => {
              if (vali) {
                if (this.yJson.length == 0) {
                  this.activeName = "agentInformation";
                  this.$message.warning("请补全表格源信息");
                  return;
                }
                if (this.xJson.length == 0) {
                  this.activeName = "agentInformation";
                  this.$message.warning("请补全表格目标信息");
                  return;
                }
                //
                const tableValueArr = this.$refs.cTable.$refs.right.$refs.total;
                for (let i = 0; i < tableValueArr.length; i++) {
                  if (tableValueArr[i].innerText > 1) {
                    this.$message.warning("合计不能超过1");
                    return;
                  }
                  if (this.saveFormStatic.percentCheck == "0") {
                    if (tableValueArr[i].innerText != 1) {
                      this.$message.warning("百分比合计必须为1");
                      return;
                    }
                  }
                }
                //
                this.saveBasicRuleDriver();
              } else {
                this.activeName = "agentInformation";
                this.$message.warning("动因信息不全！");
              }
            });
          }
          return false;
        } else {
          this.activeName = "basicInformation";
        }
      });
    },
    saveBasicRuleDriver() {
      // if(this.saveForm.driverType == '1'){
      let params = {
        copyCode: "",
        driverCode: this.saveForm.driverCode,
        driverType: this.saveForm.driverType,
        isClickFlag: this.isClickFlag,
        operateType: this.popupWindowType,
        ruleDriver: {
          driverAuthority: this.saveForm.driverAuthority,
          driverCode: this.saveForm.driverCode,
          driverDesc: this.saveForm.driverDesc,
          driverName: this.saveForm.driverName,
          driverType: this.saveForm.driverType
        }
      };
      if (this.popupWindowType == "5") {
        params.copyCode = this.editTheData.copyCode;
        params.driverCode = this.editTheData.driverCode;
      }
      console.log(this.editTheData, "保存基础信息的时候请求参数");
      console.log(params, "保存基础信息的时候请求参数");
      caRuleDriverApi
        .ruleDriverSaveBaseDriver(params)
        .then(res => {
          if (res.code == 200) {
            //保存动因详情
            //判断是复制是否点击了第二个按钮
            console.log(
              this.popupWindowType + ":::" + this.isClickFlag,
              "基础信息"
            );
            if (this.popupWindowType == "5" && this.isClickFlag == "1") {
              this.dialogVisible = false;
            } else {
              this.saveDetailDynaicRuleDriver();
            }
          } else {
            this.$message.error(res.message);
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //保存动因详情 //datafilterId: "",
    saveDetailDynaicRuleDriver() {
      console.log(this.saveForm.driverType, "this.saveForm.driverType");
      if (this.saveForm.driverType == "1") {
        let dataFilterRuleList = [];
        let dataDim = this.selectConditionList;
        for (let i = 0; i < dataDim.length; i++) {
          if (dataDim[i].filterValue) {
            let ruleDatafilterData = {
              dimId: dataDim[i].relatedDimensionCode,
              filterDesc: dataDim[i].descn,
              filterName: dataDim[i].filterName,
              filterValue: dataDim[i].filterValue,
              pubPhysicalcolumnId: dataDim[i].columnEn,
              selectionFlag: dataDim[i].selectionFlag,
              treeId: ""
            };
            ruleDatafilterData.treeId = dataDim[i].treeId;
            // if (dataDim[i].selectionFlag == "1") {
            //   ruleDatafilterData.treeId = dataDim[i].treeId;
            // }
            dataFilterRuleList.push(ruleDatafilterData);
          }
        }
        var params = {
          copyCode: "",
          backType: this.saveFormDynamic.driverOperatorType,
          driverCode: this.editTheData.driverCode,
          driverType: this.saveForm.driverType,
          filterId: this.saveFormFilter.filterId,
          isPubfilter: this.saveFormFilter.isPubfilter,
          operateType: this.popupWindowType,
          pubPhysicalcolumnId: this.saveFormDynamic.pubPhysicalcolumnId,
          pubPhysicaltableId: this.saveFormDynamic.pubPhysicaltableId,
          pubdriverCode: this.saveFormDynamic.relatedPubDriver,
          ruleDatafilterList: dataFilterRuleList
        };
        if (this.popupWindowType == "5") {
          params.copyCode = this.editTheData.copyCode;
        }
        console.log(params, "保存动态详情");
      }
      // 静因场景的保存
      if (this.saveForm.driverType == "0") {
        console.log(this.tableValue, "this.tableValue");

        if (this.yJson.length == 0) {
          this.$message.warning("请补全表格源信息");
          return;
        }
        if (this.xJson.length == 0) {
          this.$message.warning("请补全表格目标信息");
          return;
        }
        const tableValueArr = this.$refs.cTable.$refs.right.$refs.total;
        for (let i = 0; i < tableValueArr.length; i++) {
          if (tableValueArr[i].innerText > 1) {
            this.$message.warning("合计不能超过1");
            return;
          }
          if (this.saveFormStatic.percentCheck == "0") {
            if (tableValueArr[i].innerText != 1) {
              this.$message.warning("百分比合计必须为1");
              return;
            }
          }
        }
        var params = {
          copyCode: "",
          driverCode: this.editTheData.driverCode,
          driverType: this.saveForm.driverType,
          driverDimX: this.saveFormStatic.driverDimX,
          driverDimX1: this.saveFormStatic.driverDimX1,
          driverDimX2: this.saveFormStatic.driverDimX2,
          driverDimX3: this.saveFormStatic.driverDimX3,
          driverDimY: this.saveFormStatic.driverDimY,
          driverDimY1: this.saveFormStatic.driverDimY1,
          driverDimY2: this.saveFormStatic.driverDimY2,
          driverDimY3: this.saveFormStatic.driverDimY3,
          driverType: this.saveForm.driverType,
          operateType: this.popupWindowType,
          percentCheck: this.saveFormStatic.percentCheck,
          tableValue: this.tableValue,
          xJson: this.xJson,
          yJson: this.yJson
        };
        if (this.popupWindowType == "5") {
          params.copyCode = this.editTheData.copyCode;
        }
      }
      caRuleDriverApi
        .ruleDriverSaveInfo(params)
        .then(res => {
          if (res.code == 200 && res.success) {
            this.$message.success("保存成功");
            this.dialogVisible = false;
          } else {
            this.dialogVisible = false;
            this.$message.error("基础信息保存成功,动因信息保存失败");
          }
        })
        .catch(err => {
          console.log(err);
        });
    },

    toShowRemark() {
      this.toShowRemarkDetails = !this.toShowRemarkDetails;
    }
  }
};
</script>

<style lang="scss" scoped>
.elSelectiveBox {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .elSelectiveBtn {
    width: 24px;
    font-size: 12px;
    border: 1px solid #dce0e6;
    height: 24px;
    border-radius: 12px;
    line-height: 22px;
    text-align: center;
    cursor: pointer;
  }
}
.selectiveBox {
  width: 100%;
  height: 100px;
  border: 1px solid #dce0e6;
  border-radius: 4px;
  overflow-y: auto;
  .selectiveBoxEl {
    margin: 5px;
    width: 116px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .selectiveBoxTag {
    width: 100px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
}
.dynamicTitle {
  width: 200px;
  height: 40px;
  font-size: 14px;
  font-weight: 900;
  line-height: 40px;
}
.filterDataClick {
  float: left;
  color: blue;
  font-size: 12px;
  text-decoration: underline;
  margin-right: 10px;
  cursor: pointer;
}
.iconBtn {
  width: 24px;
  height: 22px;
  border: 1px solid;
  border-radius: 22px;
  text-align: center;
  line-height: 20px;
  background: #ecf1ff;

  margin: 2px 20px 0px 10px;
}

.remark .img {
  position: absolute;
  left: 0;
  bottom: 10%;
  opacity: 0.8;
  z-index: 999;
}
.remark .img:hover {
  opacity: 1;
  z-index: 999;
}

.remark .ramarkTable {
  background-color: white;
  position: absolute;
  right: 0;
  bottom: 60px;
  z-index: 666;
  width: 100%;
  border: 1px solid #ccc;
}
.remark p {
  text-align: center;
  line-height: 20px;
  color: #445375;
}
</style>
